<template>
  <div>
    <template v-if="!isEcho">
      <el-select
        v-model="svalue"
        :size="size"
        filterable
        :clearable="clearable"
        :disabled="disabled"
        :multiple="multiple"
        :placeholder="$t(placeholder)"
        :no-data-text="$t('无数据')"
        :no-match-text="$t('无数据')"
      >
        <el-option
          v-for="item in options"
          :key="item.dictValue"
          :label="$t(item.dictLabel)"
          :value="item.dictValue"
        />
      </el-select>
    </template>
    <template v-if="isEcho && currentDict">
      {{ $t(currentDict.dictLabel) }}
    </template>
  </div>

</template>

<script>
export default {
  props: {
    value: {
      type: [String, Array],
      default: ''
    },
    dictionary: {
      type: String,
      default: () => ''
    },
    label: {
      type: String,
      default: () => ''
    },
    option: {
      type: String,
      default: () => ''
    },
    size: {
      type: String,
      default: () => ''
    },
    clearable: {
      type: Boolean,
      default: true
    },
    isCheck: {
      type: Boolean,
      default: false
    },
    placeholder: {
      type: String,
      default: '请选择'
    },
    disabled: {
      type: Boolean,
      default: false
    },
    multiple: {
      type: Boolean,
      default: false,
      desc: '多选'
    },
    isEcho: {
      type: Boolean,
      default: false,
      desc: '回显label'
    }
  },
  data() {
    return {
      svalue: this.value,
      options: [],
      currentDict: null
    }
  },
  watch: {
    value(newVal) {
      this.svalue = newVal
    },
    svalue(newVal, oldVal) {
      if (newVal !== oldVal) {
        this.currentDict = this.options.find(item => { return item.dictValue === this.svalue })
        this.$emit('input', this.svalue)
        this.$emit('change', this.svalue)
      }
    }
  },
  mounted() {
    if (this.dictionary) {
      this.getDicts(this.dictionary).then((response) => {
        if (response.code === 200) {
          this.options = response.data
          if (this.isCheck && response.data.length > 0) {
            this.currentDict = response.data[0]
            this.svalue = response.data[0].dictValue
          }
          if (this.isEcho) {
            this.currentDict = this.options.find(item => { return item.dictValue === this.svalue })
          }
        }
      })
    }
  },
  methods: {}
}
</script>
